<script setup>
/**
 * 明细表格展示组件
 * tableData: 表格数据体
 * tableColInfo: 表格列数据体
 * emptyMessage: 空数据描述
 */
defineProps(['tableLabel', 'tableData', 'tableColInfo', 'emptyMessage', 'selectRowHandle'])
</script>

<template>
  <el-tab-pane :label="tableLabel" height="250">
    <el-empty v-if="tableData.length === 0" :description="emptyMessage"/>
    <div v-else class="balance-ctrl-panel">
      <slot name="delete"/>
      <slot name="save"/>
      <el-table :data="tableData" size="default" table-layout="auto" @select="selectRowHandle">
        <slot name="select"/>
        <el-table-column v-for="info in tableColInfo" :prop="info.col" :label="info.label"/>
      </el-table>
    </div>
  </el-tab-pane>
</template>

<style lang="scss">
.balance-ctrl-panel {
  .el-button {
    margin-bottom: 10px;
    font-size: 15px;
  }
}
</style>